<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>INCO学生信息采集系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" href="plugins/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="css/global.css" media="all">
    <link rel="stylesheet" href="plugins/font-awesome/css/font-awesome.min.css">

</head>

<body>
<script type="text/javascript" src="datas/nav.js"></script>
<script src="js/index.js"></script>
<div class="layui-layout layui-layout-admin" style="border-bottom: solid 5px #1aa094;">
<div class="layui-header header header-demo">
    <div class="layui-main">
        <div class="admin-login-box">
            <a class="logo" style="left: 0;" href="http://beginner.zhengjinfan.cn/demo/beginner_admin/">
                <span style="font-size: 22px;">INCO信息采集</span>
            </a>
            <div class="admin-side-toggle">
                <i class="fa fa-bars" aria-hidden="true"></i>
            </div>
            <div class="admin-side-full">
                <i class="fa fa-life-bouy" aria-hidden="true"></i>
            </div>
        </div>
        <ul class="layui-nav admin-header-item">
            <li class="layui-nav-item">
                <a href="javascript:;">清除缓存</a>
            </li>
            <li class="layui-nav-item" id="pay">
                <a href="javascript:;">联系我</a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">浏览网站</a>
            </li>
            <li class="layui-nav-item" id="video1">
                <a href="javascript:;">视频</a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;" class="admin-header-user">
                    <img src="images/0.jpg" />
                    <span>${sessionScope.UserAdmin.loginName}</span>
                </a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="javascript:;"><i class="fa fa-user-circle" aria-hidden="true"></i> 个人信息</a>
                    </dd>
                    <dd>
                        <a href="javascript:;"><i class="fa fa-gear" aria-hidden="true"></i> 设置</a>
                    </dd>
                    <dd id="lock">
                        <a href="javascript:;">
                            <i class="fa fa-lock" aria-hidden="true" style="padding-right: 3px;padding-left: 1px;"></i> 锁屏 (Alt+L)
                        </a>
                    </dd>
                    <dd>
                        <a href="index.jsp"><i class="fa fa-sign-out" aria-hidden="true"></i> 注销</a>
                    </dd>
                </dl>
            </li>
        </ul>
        <ul class="layui-nav admin-header-item-mobile">
            <li class="layui-nav-item">
                <a href="index.jsp"><i class="fa fa-sign-out" aria-hidden="true"></i> 注销</a>
            </li>
        </ul>
    </div>
</div>

<!--左侧导航面板-->
<div class="layui-side layui-bg-black" id="admin-side">
    <div class="layui-side-scroll" id="admin-navbar-side" lay-filter="side"></div>
</div>

<!--中央面板-->
<div class="layui-body" style="bottom: 0;border-left: solid 2px #1AA094;" id="admin-body">
    <div class="layui-tab admin-nav-card layui-tab-brief" lay-filter="admin-tab">
        <ul class="layui-tab-title">
            <li class="layui-this">
                <i class="fa fa-dashboard" aria-hidden="true"></i>
                <cite>后台主页</cite>
            </li>
        </ul>
        <!--横向导航栏-->
        <div class="layui-tab-content" style="min-height: 150px; padding: 5px 0 0 0;">
            <div class="layui-tab-item layui-show">
                <iframe src="AdminUserBackgroundMain.jsp"></iframe>
            </div>
        </div>
    </div>
</div>
</div>


<script type="text/javascript" src="plugins/layui/layui.js"></script>
<!--锁屏模板 start-->
<script type="text/template" id="lock-temp">
    <div class="admin-header-lock" id="lock-box">
        <div class="admin-header-lock-img">
            <img src="images/0.jpg"/>
        </div>
        <div class="admin-header-lock-name" id="lockUserName">beginner</div>
        <input type="text" class="admin-header-lock-input" value="输入密码解锁.." name="lockPwd" id="lockPwd" />
        <button class="layui-btn layui-btn-small" id="unlock">解锁</button>
    </div>
</script>
<!--锁屏模板 end -->

<script>

    var tab;

    layui.config({
        base: 'js/',
        version: new Date().getTime()
    }).use(['element', 'layer', 'navbar', 'tab'], function () {
        var element = layui.element(),
            $ = layui.jquery,
            layer = layui.layer,
            navbar = layui.navbar();
        tab = layui.tab({
            elem: '.admin-nav-card' //设置选项卡容器
            ,
            //maxSetting: {
            //	max: 5,
            //	tipMsg: '只能开5个哇，不能再开了。真的。'
            //},
            contextMenu: true,
            onSwitch: function (data) {
                console.log(data.id); //当前Tab的Id
                console.log(data.index); //得到当前Tab的所在下标
                console.log(data.elem); //得到当前的Tab大容器

                console.log(tab.getCurrentTabId())
            },
            closeBefore: function (obj) { //tab 关闭之前触发的事件
                console.log(obj);
                //obj.title  -- 标题
                //obj.url    -- 链接地址
                //obj.id     -- id
                //obj.tabId  -- lay-id
                if (obj.title === 'BTable') {
                    layer.confirm('确定要关闭' + obj.title + '吗?', { icon: 3, title: '系统提示' }, function (index) {
                        //因为confirm是非阻塞的，所以这里关闭当前tab需要调用一下deleteTab方法
                        tab.deleteTab(obj.tabId);
                        layer.close(index);
                    });
                    //返回true会直接关闭当前tab
                    return false;
                }else if(obj.title==='表单'){
                    layer.confirm('未保存的数据可能会丢失哦，确定要关闭吗?', { icon: 3, title: '系统提示' }, function (index) {
                        tab.deleteTab(obj.tabId);
                        layer.close(index);
                    });
                    return false;
                }
                return true;
            }
        });
        //iframe自适应
        $(window).on('resize', function () {
            var $content = $('.admin-nav-card .layui-tab-content');
            $content.height($(this).height() - 147);
            $content.find('iframe').each(function () {
                $(this).height($content.height());
            });
        }).resize();

        //设置navbar  左侧导航菜单
        navbar.set({
            spreadOne: true,
            elem: '#admin-navbar-side',
            cached: true,
            data: navs,
            // cached:true,
            // url: 'datas/nav.json'
        });
        //渲染navbar
        navbar.render();
        //监听点击事件
        navbar.on('click(side)', function (data) {
            tab.tabAdd(data.field);
        });
    });

</script>

<script>
    layui.use('layer', function() {
        var $ = layui.jquery,
            layer = layui.layer;

        $('#video1').on('click', function() {
            layer.open({
                title: 'YouTube',
                maxmin: true,
                type: 2,
                content: 'video.html',
                area: ['800px', '500px']
            });
        });
        $('#pay').on('click', function () {
            layer.open({
                title: false,
                type: 1,
                content: '<img src="images/xx.png" />',
                area: ['500px', '250px'],
                shadeClose: true
            });
        });


    });
</script>
</body>

</html>